<template>
  <div>
    <p>请填写相关参数及设置项（不开启奖项请将其对应数量设置为0）：</p>
    <div class="center">
      <div class="j">
        <span v-if="this.adj != null">
          一等奖：<input type="number" v-model="adj" /></span
        ><span v-if="this.bdj != null"
          >二等奖：<input type="number" v-model="bdj"
        /></span>
        <br />
        <span v-if="this.cdj != null">
          三等奖：<input type="number" v-model="cdj" /></span
        ><span v-if="this.ddj != null"
          >四等奖：<input type="number" v-model="ddj"
        /></span>
        <br />
        <span v-if="this.edj != null"
          >五等奖：<input type="number" v-model="edj" /> </span
        ><span v-if="this.fdj != null"
          >六等奖：<input type="number" v-model="fdj" /></span
        ><br />
        <span v-if="this.jdj != null"
          >七等奖：<input type="number" v-model="jdj" />
        </span>
        <span v-if="this.hdj != null"
          >八等奖：<input type="number" v-model="hdj" disabled
        /></span>
      </div>
      <span class="hs">每人每日抽奖机会：</span
      ><input type="number" class="jh" v-model="mjh" />
      <span class="hs">预计参与人数：</span
      ><input type="number" class="rs" v-model="yrs" />
      <span class="hs"> 每人最多可中奖次数：</span
      ><input type="number" v-model="mcs" class="cs" />
      <span class="hs">总中奖率：</span
      ><input type="number" class="zjl" v-model="zzjl" />%
    </div>
    <mt-button type="primary" @click="tij" size="large" class="tj"
      >提交</mt-button
    >
  </div>
</template>
<script>
export default {
  data() {
    return {
      adj: "",
      bdj: "",
      cdj: "",
      ddj: "",
      edj: "",
      fdj: "",
      jdj: "",
      hdj: "",
      mjh: "",
      yrs: "",
      mcs: "",
      zzjl: "",
    };
  },
  mounted() {
    this.axios
      .get("http://pw.clianmaimai.com:8071/dn/select_gl?prize_id=1")
      .then((result) => {
        let obj = result.data[0];
        this.adj = obj.one;
        this.bdj = obj.er;
        this.cdj = obj.san;
        this.ddj = obj.si;
        this.edj = obj.wu;
        this.fdj = obj.liu;
        this.jdj = obj.qi;
        this.hdj = obj.ba;
        this.mjh = obj.dayjihui;
        this.yrs = obj.renshu;
        this.mcs = obj.meirencishu;
        this.zzjl = obj.zongjilv;
      });
  },
  methods: {
    tij() {
      this.axios
        .post("http://pw.clianmaimai.com:8071/dn/update_jl", `one=${this.adj}`)
        .then((result) => {
          console.log(result.data);
        });
    },
  },
};
</script>

<style scoped>
.center {
  margin-left: 4vw;
}
* {
  margin: 1vh 0;
}
input {
  height: 3vh;
  width: 135px;
  border: 1px solid #767676;
}
span > input {
  width: 19vw;
  height: 3vh;
  margin-right: 7.5vw;
}
p {
  margin-bottom: 3vh;
}
.hs {
  display: inline-block;
  width: 46vw;
}
.tj {
  margin-top: 3vh;
  border-radius: 25px;
}
</style>